<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>投票结果</title>
    <style>
        body { font-family: '微软雅黑', Arial, sans-serif; background: #23272f; margin: 0; padding: 0; color: #f5f6fa; }
        .container { max-width: 600px; margin: 40px auto; background: #2c2f36; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.5); padding: 32px; }
        h1 { text-align: center; color: #fff; }
        table { width: 100%; border-collapse: collapse; margin-top: 24px; background: #23272f; }
        th, td { padding: 12px 8px; text-align: center; }
        th { background: #353945; color: #FFD700; }
        tr:nth-child(even) { background: #262a32; }
        tr:hover { background: #353945; }
        .gold-text {
            color: #FFD700 !important;
            font-weight: bold !important;
        }
        input#nameInput {
            background: #23272f;
            color: #fff;
            border: 1px solid #353945;
        }
        input#nameInput::placeholder {
            color: #bbb;
            opacity: 1;
        }
        #voteBtn {
            background: #FFD700 !important;
            color: #23272f !important;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>代理人投票排行</h1>
        <div style="margin-bottom: 24px; padding: 16px; background: #f8faff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,0.04); display: flex; align-items: center; gap: 12px;">
            <input id="nameInput" type="text" placeholder="为您喜爱的角色投票吧！" style="flex:1; padding:8px 12px; border:1px solid #cfd8dc; border-radius:4px; font-size:16px;">
            <button id="voteBtn" style="padding:8px 20px; background:#4f8cff; color:#fff; border:none; border-radius:4px; font-size:16px; cursor:pointer;">投票</button>
        </div>
        <table id="voteTable">
            <thead>
                <tr>
                    <th>代理人</th>
                    <th> </th>
                    <th>得票数</th>
                </tr>
            </thead>
            <tbody>
                <!-- 数据将由JS动态插入 -->
            </tbody>
        </table>
    </div>
    <script src="script.js"></script>
</body>
</html> 